<template>
  <a-spin :spinning="loading">
    <a-form-model v-bind="{labelCol:{sm:7,xl:7},wrapperCol:{sm:14,xl:14}}"
                  :rules="rules"
                  :model="form"
                  ref="formModel"
                  style="max-width: 800px;margin: 20px auto;">
      <a-form-model-item label="描述" prop="interviewContent">
        <a-textarea v-model="form.interviewContent"></a-textarea>
      </a-form-model-item>
      <a-form-model-item label="被采访人" prop="interviewee">
        <a-input v-model="form.interviewee" placeholder="请填写被采访人姓名(多个使用,分隔)"/>
      </a-form-model-item>
      <a-form-model-item label="采访时间">
        <j-date v-model="form.interviewTime" :show-time="true" date-format="YYYY-MM-DD HH:mm:ss"></j-date>
      </a-form-model-item>
      <a-form-model-item label="采访地点">
        <a-input v-model="form.location" placeholder="请输入采访地点"></a-input>
      </a-form-model-item>
      <a-form-model-item label="上传文件">
        <j-upload v-model="form.attach"></j-upload>
      </a-form-model-item>
      <a-button type="primary" style="display:inherit;margin: 0 auto;" @click="save">保存草稿</a-button>
    </a-form-model>
    <interview-list ref="interviewList" :params="params"></interview-list>
  </a-spin>
</template>

<script>
  //采访表单
  import {postAction} from "@/api/manage";
  import InterviewList from "./InterviewList";

  export default {
    name: "InterviewForm",
    components: {InterviewList},
    props: ['params'],
    data() {
      return {
        loading: false,
        form: {},
        rules: {
          interviewContent: [{required: true, message: '请输入采访描述内容'},{max: 1000, message: '最多输入1000字'}],
          interviewee: [{required: true, message: '请选择被采访人'}]
        }
      }
    },
    methods: {
      save() {
        this.$refs.formModel.validate(validate => {
          if (validate) {
            this.loading = true;
            postAction('task/interviewInfo/saveInterviewInfo', {...this.form, ...this.params}).then(res => {
              if (res.success) {
                this.$message.success('保存成功');
                this.reloadInterviewList();
                this.$nextTick(() => {
                  this.$refs.formModel.resetFields()
                })
              } else {
                this.$message.error(res.message);
              }
            }).catch(error => console.log(error))
              .finally(() => {
                this.loading = false;
              })
          } else {
            return false;
          }
        })
      },
      reloadInterviewList() {
        if (this.$refs.interviewList) {
          this.$refs.interviewList.loadData();
        }
      },
    }
  }
</script>

<style scoped>

</style>